<template>
  <div class="goods">
    <p>{{ uname }}</p>
    <p>{{ age }}</p>
    <p>{{ sex }}</p>
  </div>
</template>

<script>
export default {
  // 接收父组件传递过来的数据
  // 接收到的数据，和 data 数据一样用，只是不能修改
  // props: ["uname", "age", "sex"],

  // props 也可以写成对象格式 (写成对象也是为了加更多配置)
  // 有三个配置可以使用，required 表示必填；type 类型约束；default 默认值；
  props: {
    uname: {
      required: true, // 表示组件必须传递 uname
      type: String // 要求父组件传递过来的uname必须是字符串类型
    },
    age: Number, // 表示父组件传递过来的值，必须是Number类型
    sex: {
      default: '未知',
      type: [String, Number] // 如果允许多种类型，则写成数组格式
    }
  }
};
</script>

<style>
.goods {
  padding: 10px;
  margin: 8px;
  border: 3px solid black;
  min-height: 50px;
}
</style>